---
import { type CollectionEntry, getCollection } from "astro:content";
import Base from "@layouts/Base.astro";
import BlogCard from "@components/BlogCard.astro";

type Props = { posts: CollectionEntry<"blog">[] };

export async function getStaticPaths() {
  const posts = await getCollection("blog");
  const keywords = [
    ...new Set(
      await getCollection("blog").then((x) =>
        x.flatMap((x) => x.data.keywords)
      ),
    ).values(),
  ];
  return keywords.map((k) => ({
    params: { slug: k },
    props: {
      posts: posts.filter((post) =>
        post.data.keywords.some((i) => i.localeCompare(k) === 0)
      ),
    },
  }));
}

const title = "Blog";
const description = "Latest articles.";

const posts = Astro.props.posts.sort((a, b) =>
  new Date(b.data.dateCreated).valueOf() -
  new Date(a.data.dateCreated).valueOf()
);
---

<Base {title} {description}>
  <main>
    <h2>Blogue</h2> {posts.map((post) => <BlogCard {...post} />)}
  </main>
</Base>